<template>
	<view class="container">
		
			<view class="example">
				<!-- 基础表单校验 -->
				<uni-forms ref="valiForm" :rules="rules" :modelValue="valiFormData">
					<uni-forms-item label="站点名称" label-width="70px"  name="stationName">
						<uni-easyinput v-model="valiFormData.stationName" placeholder="请输入站点名称" />
					</uni-forms-item>
					<uni-forms-item label="站点类型"  label-width="70px"  name="stationType">
						<uni-easyinput v-model="valiFormData.stationType" placeholder="请输入站点类型" />
					</uni-forms-item>
					<uni-forms-item label="设施单元" label-width="70px"  name="building">
						<uni-easyinput  v-model="valiFormData.building" placeholder="请输入设施单元" />
					</uni-forms-item>
					
					<uni-forms-item label="设备名称"  label-width="70px"  name="equipmentName">
						<uni-easyinput v-model="valiFormData.equipmentName" placeholder="请输入设备名称" />
					</uni-forms-item>
					<uni-forms-item label="设备编号"  label-width="70px"  name="equipmentNum">
						<uni-easyinput v-model="valiFormData.equipmentNum" placeholder="请输入设备编号" />
					</uni-forms-item>
					<uni-forms-item label="保养内容"  label-width="70px"  name="maintenanceText">
						<uni-easyinput type="textarea" v-model="valiFormData.maintenanceText" placeholder="请输入保养内容" />
					</uni-forms-item>
					
					<uni-forms-item label="保养周期" label-width="70px"   name="period">
						<uni-easyinput v-model="valiFormData.period" placeholder="请输入保养周期" />
					</uni-forms-item>
					<uni-forms-item label="上次保养时间" label-width="70px"   required name="lastTime">
						<uni-datetime-picker type="datetime" return-type="string" v-model="valiFormData.lastTime"/>
					</uni-forms-item>
					<uni-forms-item label="是否调度" label-width="70px"   name="scheduleFlag">
						<uni-data-checkbox v-model="valiFormData.scheduleFlag" :localdata="scheduleFlags" />
					</uni-forms-item>
				</uni-forms>
				<button type="primary" @click="submit('valiForm')">提交</button>
			</view>



		
	</view>
</template>
<script>
	import {
		createEquipmentMaintenancePlan
	} from "@/api/index"
	export default {
		data() {
			return {
				
				
				// 单选数据源
				scheduleFlags: [{
					text: '是',
					value: '是'
				}, {
					text: '否',
					value: '否'
				}],
				
				
				// 校验表单数据
				valiFormData: {
					 "stationName": "",
					    "stationType": "",
					    "building": "",
					    "equipmentName": "",
					    "equipmentNum": "",
					    "maintenanceText": "",
					    "period": "",
					    "lastTime": "",
					    "scheduleFlag": ""
				},
				// 校验规则
				rules: {
					lastTime: {
						rules: [{
							required: true,
							errorMessage: '上次保养时间不能为空'
						}]
					}
				},
			
				
				
			}
		},
		
		methods: {
			
			submit(ref) {
				console.log('success', this.$refs[ref]);
				this.$refs[ref].validate().then(res => {
					console.log('success', this.valiFormData);
					createEquipmentMaintenancePlan(res).then(response => {
						console.info('ccccccc',response)
						if(response ==''){
							uni.showToast({
								title: `提交成功`
							})
							uni.navigateBack()
						}else{
							uni.showToast({
								title: `提交失败`,
								icon:'fail'
							})
						}
						
						
					})
					
				}).catch(err => {
					console.log('err', err);
				})
			},
		}
	}
</script>
<style lang="scss">

	.example {
		padding: 15px;
		background-color: #fff;
	}

	.segmented-control {
		margin-bottom: 15px;
	}

	.button-group {
		margin-top: 15px;
		display: flex;
		justify-content: space-around;
	}

	.form-item {
		display: flex;
		align-items: center;
	}

	.button {
		display: flex;
		align-items: center;
		height: 35px;
		margin-left: 10px;
	}
</style>

